import React from "react";
import { Card } from 'antd';
import Advanced01 from "./advanced01/advanced01"
import Advanced02 from "./advanced02/advanced02"


import { BrowserRouter as Router, Route, Switch, NavLink } from "react-router-dom";
class RouterList extends React.Component {
  render() {
    return (
      <div className="router">
        <Router>
          <div className="margin_left_sm">
            <h2>REACT 进阶</h2>
            <ul className="nav2">
              <li><NavLink activeClassName="selected" to="/advanced/advanced01">切换页面时 要停掉所有异步请求</NavLink></li>
              <li><NavLink activeClassName="selected" to="/advanced/advanced02">优化组建渲染</NavLink></li>
              

            </ul>
          </div>

          <hr />
          <div className="padding_h_sm margin_top_lg">
            <Card style={{ background: '#ECECEC' }}>
              <Switch>
                <Route path="/advanced/advanced01" component={Advanced01}></Route>
                <Route path="/advanced/advanced02" component={Advanced02}></Route>
              </Switch>
            </Card>
          </div>

        </Router>
      </div>
    );
  }
}

export default RouterList;
